<template>
  <a-spin :spinning="loading">
    <border-box title="采访信息列表">
      <a-empty v-if="noData"/>
      <template v-else>
        <div class="item" v-for="(item,index) in list" :key="index">
          <div>{{item.interviewContent}}</div>
          <detail-list title="" size="small">
            <detail-list-item term="被采访人">{{item.interviewee}}</detail-list-item>
            <detail-list-item term="采访时间">{{item.interviewTime||'无'}}</detail-list-item>
            <detail-list-item term="采访地点">{{item.location||'无'}}</detail-list-item>
          </detail-list>
        </div>
      </template>
    </border-box>
  </a-spin>
</template>

<script>
  //采访信息列表
  import BorderBox from "./BorderBox";
  import {getAction} from "@/api/manage";
  import DetailList from '@/components/tools/DetailList'

  const DetailListItem = DetailList.Item;

  export default {
    name: "InterviewList",
    components: {BorderBox, DetailList, DetailListItem},
    props: ['params'],
    data() {
      return {
        loading: false,
        noData: false,
        list: []
      }
    },
    created() {
      this.loadData()
    },
    methods: {
      loadData() {
        this.loading = true;
        getAction('task/interviewInfo/queryInterviewList', {taskNo: this.params.taskNo}).then(res => {
          if (res.success) {
            this.list = res.result;
            this.noData = this.list.length === 0;
          } else {
            this.$message.error(res.message);
          }
        }).catch(error => console.log(error))
          .finally(() => {
            this.loading = false;
          })
      }
    }
  }
</script>

<style scoped>
  .item {
    padding: 8px 0;
    border-bottom: 1px solid #ededed;
    line-height: 1.8;
  }

  .item:last-child {
    border: none;
  }
</style>